<template>

  <el-dialog
      v-model="add_material_visible"
      :title=" '修改记录' "
      :close-on-click-modal='false'
      :close-on-press-escape='false'
      :show-close='false'
  >
    <el-form :model="update_record_variable" :rules="add_material_rules" ref="add_material_ref"
             :label-position=" 'right' " label-width="150px">
      <el-form-item prop="car_type_name" label="单据状态">
        <el-radio-group v-model="update_record_variable.trend">
          <el-radio-button :value="false">入库</el-radio-button>
          <el-radio-button :value="true">出库</el-radio-button>
        </el-radio-group>
      </el-form-item>
      <el-form-item prop="whole_piece" label="件数">
        <el-input-number v-model="update_record_variable.whole_piece" autocomplete="off" :step="1" step-strictly>
        </el-input-number>
      </el-form-item>
      <el-form-item prop="scatt_piece" label="支数">
        <el-input-number v-model="update_record_variable.scatt_piece" autocomplete="off" :step="1" step-strictly>
        </el-input-number>
      </el-form-item>
      <el-form-item prop="weight" label="重量/吨">
        <el-input-number v-model="update_record_variable.weight" autocomplete="off" :step="0.001" step-strictly>
        </el-input-number>
      </el-form-item>
      <el-form-item prop="remark" label="备注">
        <el-input v-model="update_record_variable.remark" autocomplete="off"/>
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="cancel_add_material(add_material_ref)">取消</el-button>
				<el-button type="primary" @click="update_material(add_material_ref)">确定</el-button>
      </span>
    </template>
  </el-dialog>

</template>

<script setup lang="ts">
import {reactive, ref} from "vue";
import {ElMessage, FormInstance, FormRules} from "element-plus";
import {MaterialCRUDResp} from "@/api/inventory/material/type.ts";
import {req_record_update} from "@/api/inventory/record";
import {RecordList} from "@/api/inventory/record/type.ts";

const add_material_ref = ref<FormInstance>()

// 添加和修改所需携带变量
const update_record_variable = reactive<{
  record_id: number | null
  whole_piece: number | null
  scatt_piece: number | null
  weight: number | null
  remark: string | null
  trend: boolean
}>({
  record_id: null,
  whole_piece: null,
  scatt_piece: null,
  weight: null,
  remark: null,
  trend: false,
})

const add_material_visible = ref(false) // 决定添加和修改框是否显示
const add_material_rules = reactive<FormRules>({
  whole_piece: [{
    type: 'number',
    message: '件数为数字且不得小于零',
    min: 0,
    required: true,
  }],
  scatt_piece: [{
    type: 'number',
    message: '支数为数字且不得小于零',
    required: true,
    min: 0
  }],
  remark: [{
    type: 'string',
    message: '备注需要小于等于100个字符',
    min: 0,
    max: 100
  }],
  weight: [{
    type: 'number',
    message: '重量需要是数字，且最多三位小数',
    required: true,
    min: 0,
    max: 99999999,
  }],
})

// 关闭添加小类框
const cancel_add_material = (formEl: FormInstance | undefined) => {
  if (!formEl) return
  formEl.resetFields()
  add_material_visible.value = false
}

const open = (row: RecordList) => {
  update_record_variable.whole_piece = row.whole_piece
  update_record_variable.scatt_piece = row.scatt_piece
  update_record_variable.record_id = row.id
  update_record_variable.remark = row.remark
  update_record_variable.weight = row.weight
  update_record_variable.trend = row.trend
  add_material_visible.value = true
}

defineExpose({open});

const refresh = () => {
  emit('refresh_func')
}
const emit = defineEmits(['refresh_func'])

// 添加小类
const update_material = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid) => {
    if (valid) {
      req_record_update({
        mode: "update",
        param: {
          record_id: update_record_variable.record_id as number,
          whole_piece: update_record_variable.whole_piece as number,
          scatt_piece: update_record_variable.scatt_piece as number,
          weight: update_record_variable.weight as number,
          remark: update_record_variable.remark as string,
          trend: update_record_variable.trend,
        }
      }).then((res: MaterialCRUDResp<'update'>) => {
        ElMessage.success(res.success?.message)
      })
      add_material_visible.value = false
      refresh()
    }
  })
}
</script>

<style scoped>

</style>